package com.example.jetpackdemo

import android.os.Bundle
import androidx.annotation.DrawableRes
import androidx.appcompat.app.AppCompatActivity
import androidx.compose.Composable
import androidx.compose.unaryPlus
import androidx.ui.core.Clip
import androidx.ui.core.Text
import androidx.ui.core.dp
import androidx.ui.core.setContent
import androidx.ui.foundation.DrawImage
import androidx.ui.foundation.shape.corner.RoundedCornerShape
import androidx.ui.graphics.Color
import androidx.ui.layout.*
import androidx.ui.material.*
import androidx.ui.material.surface.Surface
import androidx.ui.res.imageResource
import androidx.ui.text.style.TextOverflow

/**
 * 作者： njb
 * 时间： 2018/11/26  13:30
 * 描述： JetPack尝鲜
 * 来源：
 */
class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            NewsComposeText("Android JetPack Demo")
        }
    }

    @Composable
    private fun NewsComposeText(s: String) {
        val image = +imageResource(R.mipmap.invitation_bg)
        MaterialTheme() {
            Column(
                crossAxisSize = LayoutSize.Expand,
                modifier = Spacing(16.dp)
            ) {
                // 放在容器中，设置大小
                Container(expanded = true, height = 180.dp) {
                    Clip(shape = RoundedCornerShape(10.dp)) {
                        //显示图片
                        DrawImage(image)
                    }
                }
                // 添加垂直方向间距20dp
                HeightSpacer(height = 20.dp)
                Text(text = "Hello $s!")
                Text(
                    "我是来尝鲜 JetPack Compose 的！JetPack Compose 尝鲜 很爽，JetPack Compose 复用性又强，可以抽取很多公共组件",
                    maxLines = 2,
                    overflow = TextOverflow.Ellipsis,
                    style = (+themeTextStyle { h5 }).withOpacity(0.5f)
                )
                Text("Android JetPack 尝鲜", style = (+themeTextStyle { body1 }).withOpacity(0.5f))
                Text("不要怂就是干", style = (+themeTextStyle { body2 }).withOpacity(0.6f))

                DrawerButton(
                    R.mipmap.invitation_bg.also { },
                    label = "Home",
                    isSelected = true
                ) {
                }
            }
        }
    }
}

@Composable
private fun DrawerButton(
    @DrawableRes icon: Int,
    label: String,
    isSelected: Boolean,
    action: () -> Unit
) {
    val textIconColor = if (isSelected) {
        +themeColor { primary }
    } else {
        (+themeColor { onSurface }).copy(alpha = 0.6f)
    }
    val backgroundColor = if (isSelected) {
        (+themeColor { primary }).copy(alpha = 0.12f)
    } else {
        +themeColor { surface }
    }

    Padding(left = 8.dp, top = 8.dp, right = 8.dp) {
        Surface(
            color = backgroundColor,
            shape = RoundedCornerShape(4.dp)
        ) {
            Button(onClick = action, style = TextButtonStyle()) {
                Row(
                    mainAxisSize = LayoutSize.Expand,
                    crossAxisAlignment = CrossAxisAlignment.Center
                ) {
                    WidthSpacer(16.dp)
                    Text(
                        text = label,
                        style = (+themeTextStyle { body2 }).copy(
                            color = textIconColor
                        )
                    )
                }
            }
        }
    }
}


